<template>
	<view class="container">
		<!-- 轮播图 -->
		<swiper class="swiper" indicator-dots="true" autoplay="true" interval="5000" duration="1500">
			<swiper-item v-for="(item, i) in sliderList" :key="i" >
				<image v-if='item.sliderpic' :src="`data:image/jpeg;base64,`+item.sliderpic" mode="aspectFill"></image></swiper-item>
		</swiper>
		<!-- 导航模块 -->
		<view class="nav">
			<view v-for="(item, index) in navList" :key="item.id" :data-id="item.id" :data-name='item.name' class="nav_box" @tap="navTolist">
				<image v-if='item.img' :src="`data:image/jpeg;base64,`+item.img" class="img"></image>
				<view class="tet">{{ item.name }}</view>
			</view>
		</view>
		<!-- 企业动态 -->
		<view class="News">
			<text class="title">企业动态</text>
			<view class="more" url="" @tap="business('news','企业动态')">
				查看更多
				<image class="jt" :src="`${url}/images/my/GRQJ.png`" mode=""></image>
			</view>
			<view class="news">
				<view class="news_item" v-for="(item, i) in newsList" :key="i" :data-id="item.id"  :data-name="item.name"  @tap="businessDetails">
					<image v-if='item.listimage'  :src="`data:image/jpeg;base64,`+item.listimage" mode="" class="img"></image>
					<view class="tet">{{ item.name }}</view>
				</view>
			</view>
		</view>
		<!-- 行业信息 -->
		<view class="News">
			<text class="title">行业信息</text>
			<view class="more" url="" @tap="business('info','行业信息')">
				查看更多
				<image class="jt" :src="`${url}/images/my/GRQJ.png`" mode=""></image>
			</view>
			<view class="news">
				<view class="news_item" v-for="(item, i) in infoList " :key="i" :data-id="item.id" :data-name="item.name" @tap="businessDetails">
					<image v-if='item.listimage' :src="`data:image/jpeg;base64,`+item.listimage" mode="" class="img"></image>
					<view class="tet">{{ item.name }}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			url: this.baseUrl,
			cmsUrl:'https://www.1xx.online/japx/cms',
			articleUrl :'https://www.1xx.online/japx/article',
			settingUrl :'https://www.1xx.online/japx/setting',
			sliderList:[],
			navList :[],
			infoList:[],
			newsList: [],
		};
	},
	onLoad() {
		this.initSlider()
		this.getNavList()
		this.getInfoList()
		this.getNewsList()
	},
	methods: {
		initSlider(){
			var that = this
			uni.request({
				url: that.settingUrl,
				data: JSON.stringify({ params: {'name':'slider','pubstatus':'active'},jsonrpc:'2.0',id:Number(new Date()) }),
				header: {
					'Content-Type': 'application/json'
				},
				method: 'POST',
				dataType: 'json',
				complete: res => {
					if (res.statusCode == 200) {
						var result = res.data.result
						if (!!result) {
							that.dataList = [];
							for (var i = 0; i < result.length; i++) {
								that.sliderList.push(result[i]);
							}
						}
					}
				}
			})
		},
		getInfoList(){
			var that = this
			uni.request({
				url: that.articleUrl,
				data: JSON.stringify({ params: { 'category':'info','pubstatus':'active'},jsonrpc:'2.0',id:Number(new Date()) }),
				header: {
					'Content-Type': 'application/json'
				},
				method: 'POST',
				dataType: 'json',
				complete: res => {
					if (res.statusCode == 200) {
						var result = res.data.result
						if (!!result) {
							that.infoList = [];
							for (var i = 0; i < result.length; i++) {
								that.infoList.push(result[i]);
							}
						}
					}
				}
			})
		},
		getNewsList(){
			var that = this
			uni.request({
				url: that.articleUrl,
				data: JSON.stringify({ params: { 'category':'news','showhome':'active'},jsonrpc:'2.0',id:Number(new Date()) }),
				header: {
					'Content-Type': 'application/json'
				},
				method: 'POST',
				dataType: 'json',
				complete: res => {
					if (res.statusCode == 200) {
						var result = res.data.result
						if (!!result) {
							that.newsList = [];
							for (var i = 0; i < result.length; i++) {
								that.newsList.push(result[i]);
							}
						}
					}
				}
			})
		},
		getNavList() {
			var that = this
			that.reqid = Number(new Date());
			uni.request({
				url: that.cmsUrl,
				data: JSON.stringify({ params: { level: "0" },jsonrpc:'2.0',id:that.reqid }),
				method: 'POST',
				header: {'Content-Type': 'application/json'},
				dataType: 'json',
				complete: res => {
					if (res.statusCode == 200) {
						that.navList = [];
						var navList = res.data.result;
						for (var i = 0; i < navList.length; i++) {
							that.navList.push(navList[i]);
						}
					}
				}
			});
		},
		navTolist(e) {
			var id = e.currentTarget.dataset['id'];
			var name = e.currentTarget.dataset["name"]
			if (name == '常用网站') {
				uni.navigateTo({ url: '/pages/commwebsite/index' });
				return;
			}
			if (name.indexOf('查询')>=0) {
				uni.navigateTo({ url: '/pages/document/search' });
				return;
			}
			uni.navigateTo({
				url: '/pages/context/list?code=' + id+'&title='+name
			});
		},
		businessDetails(e) {
			var headid = e.currentTarget.dataset['id'];
			var name = e.currentTarget.dataset["name"]
			var newpage = '/pages/information/detail?headid=' + headid+'&name=' + name
			uni.navigateTo({
				url: newpage,
				text: name
			});
		},
		business(datatype,name) {
			//企业列表
			uni.navigateTo({
				url: '/pages/information/list?type='+datatype+'&title='+name,
				text:name
			});
		}
	}
};
</script>

<style>
page {
	background-color: #f7f7f7;
}
.container {
	font-size: 14px;
	line-height: 24px;
}
.swiper {
	padding: 10px;
	height: 300upx;
	background-color: #fff;
}

/* swiper-item 里面的图片高度 */
swiper-item image {
	width: 100%;
	height: 300upx;
}
.nav {
	padding: 10px;
	padding-top: 20upx;
	display: flex;
	flex-wrap: wrap;
	background-color: #fff;
	margin-bottom: 10upx;
}
.nav_box {
	width: 25%;
	padding: 16upx;
	box-sizing: border-box;
	text-align: center;
}
.nav .img {
	width: 88upx;
	height: 88upx;
}
.nav .tet {
	text-align: center;
	font-size: 22upx;
}
.News {
	padding: 10px;
	padding-top: 30upx;
	background-color: #fff;
}
.news {
	margin-top: 20upx;
	display: flex;
	flex-wrap: wrap;
	background-color: #fff;
	margin-bottom: 10upx;
}
.news_item {
	width: 50%;
	padding: 20upx;
	box-sizing: border-box;
	text-align: center;
}
.news_item .img {
	width: 320upx;
	height: 180upx;
}
.news_item .tet {
	text-align: left;
	font-size: 26upx;
}
.title {
	font-size: 35upx;
	font-weight: 600;
	color: #060606;
}
.more {
	font-size: 25upx;
	float: right;
	color: #929292;
}
.jt {
	width: 16upx;
	height: 16upx;
	margin-left: 10upx;
}
</style>
